import React from 'react'
import {connect} from 'dva'
import moment from 'moment'
import {Link, browserHistory} from 'dva/router'
import {Table, Row, Col, Form, Input, InputNumber, DatePicker,  Tag, Select, Button, Radio, Switch, Modal, Popconfirm, message, Tabs} from 'antd';
import RightBox from "../../../components/commons/RightBox";
import RIGHT from "../../../utils/RightConstants";

const R = require('ramda');
const { RangePicker } = DatePicker;
const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;
const TabPane = Tabs.TabPane;
const dateFormat = 'YYYY-MM-DD';

const TaxStatuses = ({routes, params, children, location, dispatch, taxStatuses}) => {
    const {page, search, list, editModel} = taxStatuses;

    const columns = [{
        title: '订单号',
        dataIndex: 'orderNo',
        key: 'orderNo'
    }, {
        title: '合同协议号',
        dataIndex: 'contractNo',
        key: 'contractNo'
    },{
        title: '报关单号',
        dataIndex: 'declaratNo',
        key: 'declaratNo'
    }, {
        title: '出口日期',
        dataIndex: 'exportTime',
        key: 'exportTime'
    }, {
        title: '客户名称',
        dataIndex: 'companyname',
        key: 'companyname'
    }, {
        title: '退税金额',
        dataIndex: 'drawbackAmount',
        key: 'drawbackAmount'
    }, {
        title: '放行状态',
        dataIndex: 'passStatus',
        key: 'passStatus'
    }, {
        title: '外汇状态',
        dataIndex: 'foxerStatus',
        key: 'foxerStatus'
    }, {
        title: '发票状态',
        dataIndex: 'invoiceStatus',
        key: 'invoiceStatus'
    }, {
        title: '退税融资状态',
        dataIndex: 'drawbackFianceStatus',
        key: 'drawbackFianceStatus'
    }, {
        title: '交单税局状态',
        dataIndex: 'presentStatus',
        key: 'presentStatus'
    }, {
        title: '退税款到账状态',
        dataIndex: 'transferAccountStatus',
        key: 'transferAccountStatus'
    }, {title: '预开票',
        render(record){
            return record.isperopeninvoice === "2" ? "是" : "否";
        }
    },{
        title: '操作',
        render(record) {
            return (
                <RightBox resource={RIGHT.DRAW.DRAW_TAX_EDIT}>
                    <span>
                        <a href="#" onClick={() => {
                            dispatch({
                                type: 'taxStatuses/getTaxStatusDetailById',
                                payload: {
                                    orderId: record.orderId,
                                }
                            })
                        }}>查看</a>
                    </span>
                </RightBox>

            );
        }
    }];


    const formItemLayout = {
        labelCol: {span: 7},
        wrapperCol: {span: 17}
    };

    const SearchForm = Form.create()(({form}) => {
        const {getFieldDecorator, validateFields} = form;

        const handleSearch = function () {
            validateFields((errors, values) => {
                if (errors) {
                    return
                }

                dispatch({
                    type: 'taxStatuses/setSearch', payload: {
                        search: {
                            orderno: values.orderno,
                            contractNo:values.contractNo,
                            declaratNo: values.declaratNo,
                            drawbackFianceStatus: values.drawbackFianceStatus,
                            presentStatus: values.presentStatus,
                            transferAccountStatus: values.transferAccountStatus,
                            time: values.time,
                            cstName: values.cstName,
                            exportStart: '',
                            exportEnd: ''
                        }
                    }
                });
                let newPage = page;
                newPage.page = 1;
                dispatch({
                    type: 'taxStatuses/setPage', payload: {
                        page: newPage
                    }
                });
                dispatch({type: 'taxStatuses/getStatusesList'});
            });
        }

        const exportTaxStatusList = function () {
            validateFields((errors, values) => {
                let exportStart = "";
                let exportEnd = "";
                if (values.time != null && values.time != undefined) {
                    if(values.time.length >=2 ){
                        if(values.time[0] != ''){
                            exportStart = values.time[0].format(dateFormat);
                        }
                        if(values.time[1] != ''){
                            exportEnd = values.time[1].format(dateFormat);
                        }

                    }

                }

                dispatch({
                    type: 'taxStatuses/exportTaxStatusList', payload: {
                        orderNo: values.orderno,
                        declaratNo: values.declaratNo,
                        drawbackFianceStatus: values.drawbackFianceStatus,
                        presentStatus: values.presentStatus,
                        transferAccountStatus: values.transferAccountStatus,
                        cstName: values.cstName,
                        exportStart: exportStart,
                        exportEnd: exportEnd,
                        contractNo: values.contractNo,
                    }
                });
            });


        }

        return (
            <div>
                <Row>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'订单号'}>
                            {getFieldDecorator('orderno', {initialValue: search.orderno})(
                                <Input/>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'合同协议号'}>
                            {getFieldDecorator('contractNo', {initialValue: search.contractNo})(
                                <Input/>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'报关单号'}>
                            {getFieldDecorator('declaratNo', {initialValue: search.declaratNo})(
                                <Input/>
                            )}
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span={7}>
                        <FormItem
                            {...formItemLayout}
                            label={'退税款到账'}
                        >
                            {getFieldDecorator('transferAccountStatus', {
                                initialValue: R.isNil(search.transferAccountStatus) ? '' : search.transferAccountStatus
                            })(
                                <Select style={{width: '100%'}}>
                                    <Option value="">全部</Option>
                                    <Option value="0">待退税</Option>
                                    <Option value="1">退税款到账</Option>
                                    <Option value="2">暂缓退税</Option>
                                    <Option value="3">税局发函</Option>
                                </Select>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'出口日期'}>
                            {getFieldDecorator('time', {initialValue:
                                    [ search.exportStart == '' ? '' : moment(search.exportStart, dateFormat), search.exportEnd == '' ? '' :moment(search.exportEnd, dateFormat)]})(
                                <RangePicker
                                    style={{width:'200px'}}
                                    showTime={{ format: 'YYYY-MM-DD' }}
                                    format="YYYY-MM-DD"
                                    placeholder={['开始时间', '结束时间']}
                                />
                            )}
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span={7}>
                        <FormItem
                            {...formItemLayout}
                            label={'交单税局状态'}
                        >
                            {getFieldDecorator('presentStatus', {
                                initialValue: R.isNil(search.presentStatus) ? '' : search.presentStatus
                            })(
                                <Select style={{width: '100%'}}>
                                    <Option value="">全部</Option>
                                    <Option value="1">已交单</Option>
                                    <Option value="0">未交单</Option>
                                </Select>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem
                            {...formItemLayout}
                            label={'退税融资款释放'}
                        >
                            {getFieldDecorator('drawbackFianceStatus', {
                                initialValue: R.isNil(search.drawbackFianceStatus) ? '' : search.drawbackFianceStatus
                            })(
                                <Select style={{width: '100%'}}>
                                    <Option value="">全部</Option>
                                    <Option value="1">已释放</Option>
                                    <Option value="0">未释放</Option>
                                </Select>
                            )}
                        </FormItem>
                    </Col>


                </Row>
                <Row>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'客户名称'}>
                            {getFieldDecorator('cstName', {initialValue: search.cstName})(
                                <Input/>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={3} style={{textAlign: 'right'}}>
                        <Button type="primary" icon="search" style={{marginRight: 5}} onClick={handleSearch}>查询</Button>
                    </Col>

                    <Col span={3} style={{textAlign: 'right'}}>
                        <RightBox resource={RIGHT.DRAW.EXPORTING_TAXREFUND_LIST}>
                            <Button type="primary" icon="large" style={{marginRight: 5}} onClick={exportTaxStatusList}>导出退税状态列表</Button>
                        </RightBox>
                    </Col>
                </Row>
            </div>
        );
    });

    return (
        <div>
            <EditTaxStatuses visible={editModel.showStatus} title={editModel.title} confirmLoading={editModel.confirmLoading}
                                dispatch={dispatch} editModel={editModel} />

            <SearchForm/>

            <Table rowKey={record => record.orderId} scroll={{x:1300}} dataSource={list} columns={columns} bordered={true} size={'middle'} pagination={{
                showTotal: total => `共 ${total} 条数据`,
                pageSize: page.size,
                total: page.totalRow,
                showSizeChanger: true,
                current:page.page,
                onShowSizeChange: (current, size) => {
                    let newPage = page;
                    newPage.size = size;
                    newPage.page = 1;
                    dispatch({
                        type: 'taxStatuses/setPage', payload: {
                            page: newPage
                        }
                    });
                    dispatch({type: 'taxStatuses/getStatusesList'});
                },
                onChange: (pageNumber, pageSize) => {
                    let newPage = page;
                    newPage.page = pageNumber;
                    dispatch({
                        type: 'taxStatuses/setPage', payload: {
                            page: newPage
                        }
                    });
                    dispatch({type: 'taxStatuses/getStatusesList'});
                }
            }}/>
        </div>

    );
}

const EditTaxStatuses = ({visible, title, editModel, dispatch, confirmLoading}) => {


    const formItemLayout = {
        labelCol: {
            xs: {span: 24},
            sm: {span: 7},
        },
        wrapperCol: {
            xs: {span: 24},
            sm: {span: 14},
        },
    };

    let xform = editModel.form;

    let onCancel = () =>{
        dispatch({
            type: 'taxStatuses/setEditModel',
            payload: {
                showStatus: false
            }
        });
    }

    const WrappedForm = Form.create()(({form}) => {
        const {getFieldDecorator, validateFields} = form;

        const sumbit = function () {
            validateFields((errors, values) => {
                if (errors) {
                    return
                }

                let presenttime = values.presenttime.format(dateFormat);
                dispatch({
                    type: 'taxStatuses/submittransferstatus',
                    payload: {
                        id: xform.id,
                        presenttime: presenttime,
                        transferaccountstatus: values.transferaccountstatus,
                        presentstatus: xform.presentstatus,

                    }
                });
            });
        }

        let footer = [];
        footer.push(<Button key="cancel" size="large" onClick={onCancel}>关闭</Button>);

        if(xform.transferaccountstatus != 1){
            footer.push(<Button key="apply" size="large" onClick={sumbit}>提交</Button>);
        }


        return (
            <Modal  footer={footer} visible={visible} title={title} confirmLoading={confirmLoading} width={editModel.width} wrapClassName="vertical-center-modal"   onCancel={onCancel} >

                <Form>
                    <Row>
                        <Col span={15}>
                            <FormItem
                                {...formItemLayout}
                                label="退税款到账状态"
                                hasFeedback
                            >
                                {getFieldDecorator('transferaccountstatus', {
                                    rules: [{
                                        required: true, message: '请选择退税款到账状态！',
                                    }],
                                    initialValue: xform.transferaccountstatus == undefined ? "" :xform.transferaccountstatus
                                })(
                                    <Select disabled = {xform.transferaccountstatus == 1 || xform.presentstatus == 0 ? true : false}>
                                        <Option value=""></Option>
                                        <Option value="0">待退税</Option>
                                        <Option value="1">退税款到账</Option>
                                        <Option value="2">暂缓退税</Option>
                                        <Option value="3">税局发函</Option>
                                    </Select>
                                )}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={15}>
                            <FormItem
                                {...formItemLayout}
                                label="交单时间"
                                hasFeedback
                            >

                                {getFieldDecorator('presenttime', {
                                    rules: [{
                                        required: true, message: '请输入交单时间',
                                    }],
                                    initialValue: (xform.presenttime == '' || xform.presenttime == null)? '' : moment(xform.presenttime, dateFormat)
                                })(
                                    <DatePicker
                                        showTime={{ format: 'YYYY-MM-DD' }}
                                        format="YYYY-MM-DD"
                                        placeholder="请选择时间"
                                        disabled={(xform.presenttime == '' || xform.presenttime == null || xform.presentstatus == 0)?  false : true}/>
                                )}
                            </FormItem>
                        </Col>

                        {/*{xform.transferaccountstatus != 1 ?*/}
                            {/*<Col >*/}
                                {/*<Button type="primary"  onClick={sumbit}>提交</Button>*/}
                            {/*</Col>*/}
                            {/*: ""*/}
                        {/*}*/}

                    </Row>

                    <Tabs  >
                        <TabPane tab="报税四单备案" key="1">
                            <FormItem {...formItemLayout} label="下载报关单复印件" hasFeedback>
                                <a href="#" onClick={() => {
                                    dispatch({
                                        type: 'taxStatuses/downloadFile',
                                        payload: {
                                            type: "order",
                                            "url": xform.url,
                                        }
                                    })
                                }}>{R.isNil(xform.url) || R.isEmpty(xform.url) ? "无" : "下载"}</a>

                            </FormItem>
                            <FormItem {...formItemLayout} label="下载出口供货合同下载" hasFeedback>
                                <a href="#" onClick={() => {
                                    dispatch({
                                        type: 'taxStatuses/exportInvoice',
                                        payload: {
                                            orderId: xform.id,
                                        }
                                    })}}>下载</a>

                            </FormItem>
                            <FormItem{...formItemLayout} label="装货单" hasFeedback>
                                <a href="#" onClick={() => {
                                    dispatch({
                                        type: 'taxStatuses/downloadFile',
                                        payload: {
                                            type: "order",
                                            "url": xform.inputboxpage,
                                        }
                                    })
                                }}>{R.isNil(xform.inputboxpage) || R.isEmpty(xform.inputboxpage) ? "无" : "下载"}</a>

                            </FormItem>
                            <FormItem {...formItemLayout} label="提单复印件" hasFeedback>
                                <a href="#" onClick={() => {
                                    dispatch({
                                        type: 'taxStatuses/downloadFile',
                                        payload: {
                                            type: "order",
                                            "url": xform.sendreceiptpage,
                                        }
                                    })
                                }}>{R.isNil(xform.sendreceiptpage) || R.isEmpty(xform.sendreceiptpage) ? "无" : "下载"}</a>

                            </FormItem>
                        </TabPane>
                    </Tabs>

                </Form>
            </Modal>
        );
    });

    return (
        <WrappedForm/>
    );

}



export default connect(({taxStatuses}) => ({taxStatuses}))(TaxStatuses)
